<template>
  <el-row class="warp">
    <el-col :span="24" class="warp-breadcrum">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }"><b>首页</b></el-breadcrumb-item>
        <el-breadcrumb-item>应援管理</el-breadcrumb-item>
        <el-breadcrumb-item>应援列表</el-breadcrumb-item>
      </el-breadcrumb>
    </el-col>
    <el-table
      :data="supportList"
      style="width: 100%"
      :row-class-name="tableRowClassName">
      <el-table-column
        prop="title"
        label="名称"
      >
      </el-table-column>

      <el-table-column
        prop="begin_time"
        label="开始日期">
      </el-table-column>
      <el-table-column
        label="结束日期">
        <template slot-scope="scope">
          <span>{{scope.row.end_time|moment("YYYY-MM-DD HH:mm:ss")}}</span></template>
      </el-table-column>
      <el-table-column
        label="粉丝站Logo">
        <template slot-scope="scope">
          <img class="support-item-culb-logo" v-bind:src="scope.row.club_icon"/>
        </template>
      </el-table-column>
      <el-table-column
        prop="club_name"
        label="粉丝站">
      </el-table-column>
      <el-table-column
        prop="brand_name"
        label="赞助商"></el-table-column>
      <el-table-column
        label="赞助商Logo">
        <template slot-scope="scope">
          <img class="support-item-culb-logo" v-bind:src="scope.row.brand_icon"/>
        </template>
      </el-table-column>

    </el-table>



  </el-row>

</template>
<script>
  import API from '../../api/api';
  var  pos =0;

  export default {

    data() {
      return {
        supportList: []
      }
    },
    methods: {
      getSupport: function () {
        let that = this;
        let user = JSON.parse(localStorage.getItem('access-user'))
        let params = {}
        console.log("发起请求",pos)
        API.getSupportList(pos, params).then(function (result) {
          console.log("我拿到列表了", result)
          that.supportList = result.data.items;
        })
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        pos = val-1
        this.getSupport();
      },
      tableRowClassName({row, rowIndex}) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      }
    },
    created() {

      this.getSupport()
    },
    mounted() {

    }
  }
</script>

<style>
  .demo-table-expand label {
    font-weight: bold;
  }

  .support-item-bg {
    width: 100px;
    height: 50px;
  }

  .support-item-culb-logo {
    width: 50px;
    height: 50px;
  }


  .el-pagination-positon-cotent{
   text-align: center;margin-top: 30px;

  }
</style>
